<template>
  <div>
    <h1>ActionSheet 演示</h1>

    <button @click="open = true">Open</button>

    <ActionSheet
      v-model="open"
      :actions="actions"
      close-on-click-overlay
      cancel-text="取消"
      @select="onSelect"
      @cancel="onCancel"
    />
  </div>
</template>

<script>
import ActionSheet from "./components/ActionSheet.vue";

export default {
  components: {
    ActionSheet,
  },

  data() {
    return {
      open: false,
      actions: [{ name: "选项一" }, { name: "选项二" }, { name: "选项三" }],
    };
  },

  methods: {
    onSelect(item) {
      // this.open = false;
      console.log(item);
    },
    onCancel() {
      console.log("cancel");
    },
  },
};
</script>
